<!-- 服务费管理 -->
<template>
    <div class="content-box">
        <FilterBox
            :labelWidth="120"
            :filterItemList="filterItemList"
            :filterData="filterData"
            @search="search"
            @clear="clear"
            @keep="keepHeaderList"
        >
        </FilterBox>
        <MyTable 
            :tableColumn="tableColumn" 
            :tableData="tableData" 
            @setOrder="setOrder" 
            @sendCurrentData="setCurrent"
            @cellDblclick="cellDblclick"
        >
            <template v-slot:content="scope">
                <span>{{ scope.row[scope.config.prop] }}</span>
            </template>
        </MyTable>
        <!-- 分页组件 -->

        <Pagination
            :currentPage="pageinfo.page"
            :pageSize="pageinfo.limit"
            :total="pageinfo.number_all"
            :page_all="pageinfo.page_all"
            @pagination="SetPagination"
            @sendPushButton="pushButton"
        >
        </Pagination>

        <Add @success="getTableData" ref="add"></Add>
        <Edit @success="getTableData" ref="edit"></Edit>
    </div>
</template>

<script>
import Add from './ServiceFeeManagement_add';
import Edit from './ServiceFeeManagement_edit';
export default {
    components: {
        Add,
        Edit
    },
    data() {
        return {
            filterItemList: [
                // input输入框
                {
                    label: this.$t('ServiceFeeManagementLang.Service_fee_name'),
                    width: 200,
                    filterKey: 'name',
                    filterType: 'SearchInput',
                    placeholderStr: null
                }
            ],
            filterData: {
                page: '',
                limit: '30',
                order: '',
                created_by:JSON.parse(sessionStorage.getItem('userData')).created_by.length==0?JSON.parse(sessionStorage.getItem('userData')).uid:JSON.parse(sessionStorage.getItem('userData')).created_by,

                name: ''
            },

            tableColumn: [
                {
                    label: '',
                    prop: 'table_code',
                    width: 40
                },
                {
                    checked: true,
                    label: this.$t('ServiceFeeManagementLang.Service_fee_name'),
                    prop: 'name',
                    width: 140,
                    order: ''
                },
                {
                    checked: true,
                    label: this.$t('ServiceFeeManagementLang.Server_charging_method'),
                    prop: 'chargeMethod_name',
                    width: 140,
                    order: ''
                },
                {
                    checked: true,
                    label: this.$t('ServiceFeeManagementLang.Payment_unit_price'),
                    prop: 'unitPrice',
                    width: 140,
                    order: ''
                },
                {
                    checked: true,
                    label: this.$t('ServiceFeeManagementLang.Payment_cost'),
                    prop: 'cost',
                    width: 140,
                    order: ''
                },
            ],
            tableData: [],

            pageinfo: {
                page: 1,
                page_all: 1,
                limit: 30,
                number_all: 0
            },
            sendDataObj: {}
        };
    },
    computed: {
        tabsId() {
            return this.$store.state.tabsId;
        }
    },
    mounted() {
        this.getHeaderList();
        this.getTableData();
    },
    methods: {
        //查询
        search() {
            this.getTableData();
        },
        //清空
        clear() {
            (this.filterData.name = ''), this.getTableData();
        },
        // 获取表头组
        getHeaderList() {
            this.$get('get_th', { menu_id: this.tabsId }).then((res) => {
                if (!!res.data.th_json) {
                    this.tableColumn = JSON.parse(res.data.th_json);
                }
            });
        },
        //保存表头表头组
        keepHeaderList() {
            let params = new FormData();
            params.append('menu_id', this.tabsId);
            params.append('th_json', JSON.stringify(this.tableColumn));
            this.$postForm('save_th', params).then((res) => {});
        },
        // 点击排序
        setOrder(data) {
            this.filterData.order = data;
            this.getTableData();
        },
        // 更改分页
        SetPagination(data) {
            this.filterData.page = data.page;
            this.filterData.limit = data.limit;
            this.pageinfo.page = data.page;
            this.pageinfo.limit = data.limit;
            this.getTableData();
        },
        pushButton(route) {
            if (route == 'add') {
                this.$refs.add.init();
            } else if (route == 'edit') {
                if (JSON.stringify(this.sendDataObj) == '{}' || this.sendDataObj == null) {
                    this.$message.warning(this.$t('common.message_warn_text'));
                } else {
                    this.$refs.edit.init(this.sendDataObj);
                }
            } else if (route == 'close') {
                if (JSON.stringify(this.sendDataObj) == '{}') {
                    this.$message.warning(this.$t('common.message_warn_text'));
                } else {
                    let params = new FormData();
                    params.append('id', this.sendDataObj.id);
                    this.$postForm('additionalChargeOff', params).then((res) => {
                        if(res.success){
                            this.$message.success(res.msg);
                            this.getTableData();
                        }
                    });
                }
            } else if (route == 'look') {
                if (JSON.stringify(this.sendDataObj) == '{}' || this.sendDataObj == null) {
                    this.$message.warning(this.$t('common.message_warn_text'));
                } else {
                    this.$refs.edit.init(this.sendDataObj,'look');
                }
            }
        },
        cellDblclick(obj){
            let row=obj.row
            this.$refs.details.init(row);
        },
        // 获取表格数据
        getTableData() {
            this.$get('additionalChargeList', this.filterData).then((res) => {
                this.tableData = res.data;
                this.pageinfo = res.pageinfo;
                this.pageinfo.limit = Number(this.pageinfo.limit);
                this.sendDataObj = {};
            });
        },
        setCurrent(data) {
            this.sendDataObj = data;
        }
    }
};
</script>
<style scoped lang="less">
.tableBox {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
</style>